@charset "utf-8";

* {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    -webkit-overflow-scrolling: touch;
}

html,
body {
    width: 100%;
    height: 100%;
}

body {
    overflow-x: hidden;
    min-width: 320px;
    -webkit-text-size-adjust: none;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
    -webkit-font-smoothing: subpixel-antialiased;
    -moz-user-select: none;
    -webkit-user-select: none;
    font: .26rem/1.2 Arial, "Microsoft yahei";
    background-color: transparent;
}

input,
select,
button {
    font-size: .26rem;
    -webkit-appearance: none;
}

img {
    max-width: 100%;
    border-style: none;
}

body,
div,
dl,
dt,
dd,
ul,
ol,
li,
h1,
h2,
h3,
h4,
h5,
h6,
pre,
code,
form,
fieldset,
legend,
input,
textarea,
p,
blockquote,
th,
td,
hr,
button,
article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section {
    margin: 0;
    padding: 0
}

article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section,
iframe {
    display: block
}

iframe,
fieldset,
img,
button,
input {
    border: 0
}

h1,
h2,
h3,
h4,
h5,
h6 {
    font-size: 100%;
    font-weight: normal;
}

audio,
canvas,
video {
    display: inline-block;
    *display: inline;
    *zoom: 1
}

table {
    border-collapse: collapse;
    border-spacing: 0
}

address,
cite,
dfn,
em,
var,
i {
    font-style: normal;
    font-weight: normal
}

del {
    text-decoration: line-through
}

ul,
ol {
    list-style: none
}

a {
    text-decoration: none;
}

a:hover {
    color: #000;
}

a:visited {
    color: #000;
}

a:link {
    color: #000;
}

a {
    color: #000;
}

button,
input,
select,
textarea {
    font-size: 100%
}

input {
    border-radius: 0
}

body {
    overflow-x: hidden;
    min-width: 320px;
    font-family: "Microsoft YaHei";
    background: #fff;
    color: #333;
    -webkit-text-size-adjust: none;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
    -webkit-font-smoothing: subpixel-antialiased;
    -moz-user-select: none;
    -webkit-touch-callout: none;
    -webkit-user-select: none
}

input::-webkit-input-placeholder {
    color: #999 !important
}

input:-moz-placeholder {
    color: #999 !important
}

input::-moz-placeholder {
    color: #999 !important
}

input:-ms-input-placeholder {
    color: #999 !important
}

:focus {
    outline: 0
}

object:focus {
    outline: none;
}

* {
    padding: 0;
    margin: 0;
}

ul li {
    list-style-type: none
}

a {
    text-decoration: none;
    color: #333;
}

.cf:after {
    content: '';
    display: table;
    clear: both
}

.cf {
    *zoom: 1
}

.hide {
    display: none !important;
}

img {
    vertical-align: middle;
}

body,
html {
    background: #efefef;
    color: #333;
    width: 100%;
    height: 100%;
}

.loading {
    width: .9rem;
    height: .3rem;
    position: fixed;
    top: 85%;
    left: 50%;
    margin-left: -.46rem;
}

.loading img {
    width: 100%;
    height: 100%;
}

/*登录页*/
.login_box {
    width: 100%;
    height: 100%;
    background: url("../image/login_bg.jpg") no-repeat left center;
    background-size: 100% 100%;
}

.login_box .head_img {
    text-align: center;
}

.login_box .logo_img {
    display: inline-block;
    margin: 0 auto;
    width: 1.4rem;
    height: 1.4rem;
    background: url("../image/logo.png") no-repeat center center #ffffff;
    background-size: 1.14rem .9rem;
    border-radius: .18rem;
    margin-top: 26%;
}

.login_box h2 {
    font-size: .33rem;
    color: #fff;
    text-align: center;
    line-height: 1rem;
}

.login_box .input_li {
    border: .02rem solid #f60;
    border-radius: 1rem;
}

.login_box .login_input {
    padding: 0 12%;
    margin-top: 5%;
}

.login_box .login_input li {
    margin: 1% 0
}

.login_box .login_input li.li2 {
    padding: 0 10%;
}

.login_box .login_input .userName {
    width: 100%;
    height: .8rem;
    line-height: .8rem;
    border: none;
    padding-left: 15%;
    background: url("../image/login_user.png") no-repeat 5% center transparent;
    background-size: .4rem .4rem;
    font-size: .28rem;
    color: #fff;
}

.login_box .login_input .label1 {
    float: left;
}

.login_box .login_input label {
    height: 1rem;
    line-height: 1rem;
    font-size: .28rem;
    color: #fff;
}

.login_box .login_input label span {
    width: .4rem;
    height: 1rem;
    display: inline-block;
    background: url("../image/radio_normal.png") no-repeat center center;
    background-size: .4rem .4rem;
    margin-right: .2rem;
    vertical-align: middle;
}

.login_box .login_input label.check span {
    background: url("../image/radio_checked.png") no-repeat center center;
    background-size: .4rem .4rem;
}

.login_box .login_input .label2 {
    float: right;
}

.login_box .login_input .login_btn {
    width: 100%;
    height: .8rem;
    line-height: .8rem;
    color: #ffffff;
    font-size: .36rem;
    background: #f60;
    border-radius: .4rem;
}

.login_box .login_input .server_set {
    float: right;
    margin-top: 5%;
    color: #ffffff;
    font-size: .28rem;
}

.login_box .version {
    font-size: .3rem;
    margin-top: 10%;
    text-align: center;
    color: #ffffff;
}

/*服务器设置页*/
.server_set_box {
    width: 100%;
    height: 100%;
    background: #ffffff;
}

.server_set_box .head {
    position: relative;
    width: 100%;
    height: .9rem;
    line-height: .9rem;
    font-size: .3rem;
    color: #fff;
    text-align: center;
    background: #f60;
}

.server_set_box .head span {
    position: absolute;
    left: 0;
    top: 0;
    display: inline-block;
    width: .9rem;
    height: .9rem;
    background: url("../image/server_set_close.png") no-repeat center center;
    background-size: .42rem .42rem;
}

.server_set_box .server_b {
    padding: 5%;
}

.server_set_box .server_input {
    border: .01rem solid #ccc;
    border-radius: .3rem;
}

.server_set_box .server_input li {
    width: 100%;
    height: .8rem;
    line-height: .7rem;
}

.server_set_box .server_input li.li2 {
    border-radius: .3rem .3rem 0 0;
    border-bottom: .01rem solid #ccc;
}

.server_set_box .server_input span {
    width: 25%;
    height: .8rem;
    padding-left: 3%;
    display: inline-block;
    vertical-align: middle;
    font-size: .28rem;
    text-align: right;
}

.server_set_box .server_input input {
    width: 66%;
    height: .7rem;
    line-height: .7rem;
    padding-left: 2%;
    font-size: .28rem;
    vertical-align: middle
}

.server_set_box .server_btn {
    margin-top: 12%;
    padding: 0 10%
}

.server_set_box .server_btn button {
    width: 2rem;
    height: .76rem;
    line-height: .76rem;
    color: #ffffff;
    font-size: .3rem;
    border-radius: .1rem;
    background: #f60;
    float: left
}

.server_set_box .server_btn button.server_btn_keep {
    float: right;
}

/*坐席队列*/
.queue_box2 {
    width: 100%;
    height: 100%;
    background: #ffffff;
}

.queue_box2 .head {
    position: relative;
    width: 100%;
    height: .9rem;
    line-height: .9rem;
    font-size: .3rem;
    color: #fff;
    text-align: center;
    background: #f60;
}

.queue_box2 .head span {
    position: absolute;
    left: 0;
    top: 0;
    display: inline-block;
    width: .9rem;
    height: .9rem;
    font-size: .26rem;
}

.queue_box2 .queue_list {
    height: calc(100% - 1.9rem);
    overflow-y: auto;
}

.queue_box2 .queue_list li {
    border-bottom: .01rem solid #dfdfdf;
    padding: .1rem .15rem;
    position: relative;
    height: 1rem;
    line-height: 1rem;
}

.queue_box2 .queue_list li .p1 {
    font-size: .28rem;
    height: .4rem;
    line-height: .4rem;
}

.queue_box2 .queue_list li .p2 {
    font-size: .24rem;
    height: .5rem;
    line-height: .5rem;
}

.queue_box2 .queue_list li .p2 span {
    margin-right: .4rem;
}

.queue_box2 .queue_list li .queue_state {
    position: absolute;
    right: .2rem;
    top: .2rem;
    color: #3b8cff;
    font-size: .26rem;
    height: .4rem;
    line-height: .4REM;
}

.queue_box2 .queue_foot {
    height: 1rem;
    line-height: .8rem;
    padding: .1rem .15rem;
}

.queue_box2 .queue_foot .system_auto {
    padding-left: .5rem;
    background: url("../image/select_default.png") no-repeat left center;
    background-size: .4rem .4rem;
    font-size: .28rem;
    float: left;
}

.queue_box2 .queue_foot .check {
    background: url("../image/select_checked.png") no-repeat left center;
    background-size: .4rem .4rem;
}

.queue_box2 .queue_foot .next_one {
    padding: .14rem .12rem;
    font-size: .26rem;
    background: #cfcfcf;
    box-shadow: 0.03rem 0.03rem 0.04rem #333;
    float: right;
    margin-top: .12rem;
    color: #333;
}

/*客户队列*/
.queue_box1 {
    width: 100%;
    height: 100%;
    background: #ffffff;
}

.queue_box1 .head {
    position: relative;
    width: 100%;
    height: .9rem;
    line-height: .9rem;
    font-size: .3rem;
    color: #fff;
    text-align: center;
    background: #f60;
}

.queue_box1 .head span {
    position: absolute;
    left: 0;
    top: 0;
    display: inline-block;
    width: .9rem;
    height: .9rem;
    font-size: .24rem;
}

.queue_box1 .queue_list {
    height: calc(100% - 1.9rem);
    overflow-y: auto;
}

.queue_box1 .queue_list li {
    border-bottom: .01rem solid #dfdfdf;
    padding: .1rem .15rem;
    position: relative;
    height: 1rem;
    line-height: 1rem;
}

.queue_box1 .queue_list li .p1 {
    font-size: .24rem;
    height: .4rem;
    line-height: .4rem;
}

.queue_box1 .queue_list li .p2 {
    font-size: .24rem;
    height: .5rem;
    line-height: .5rem;
    width: 100%;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
}

.queue_box1 .p1 .queue_name {
    color: #3b8cff;
    font-size: .28rem;
}

/*客户排队*/
.line_up {
    width: 100%;
    height: 100%;
    background: #ffffff;
    text-align: center
}

.line_up .head {
    position: relative;
    width: 100%;
    height: .9rem;
    line-height: .9rem;
    font-size: .3rem;
    color: #fff;
    text-align: center;
    background: #f60;
}

.line_up .show_server {
    margin-top: 8%;
    font-size: .26rem;
}

.line_up .time_b {
    height: 1.8rem;
    line-height: 1.8rem;
}

.line_up .time {
    padding: .2rem .36rem;
    border-radius: .5rem;
    font-size: .5rem;
    color: #f60;
    border: .04rem solid #f60;
}

.line_up .other_num {
    font-size: .36rem;
}

.line_up .line_up_btn {
    padding: .2rem .25rem;
    background: #f60;
    color: #fff;
    font-size: .28rem;
    margin: 7% auto 0;
    border-radius: .06rem;
}

/*客户会话页面*/
.dialog {
    width: 100%;
    height: 100%;
    background: #ffffff;
    text-align: center
}

.dialog .head {
    width: 100%;
    height: 1.1rem;
    font-size: .26rem;
    color: #fff;
    text-align: center;
    background: #f60;
}

.dialog .head .p1 {
    height: .5rem;
    line-height: .58rem;
}

.dialog .head .p2 {
    height: .5rem;
    line-height: .5rem;
}

.dialog .video {
    width: 100%;
}

.dialog .video .video_contain {
    width: 100%;
}

.dialog .audio {
    width: 20%;
    height: .6rem;
    position: fixed;
    z-index: 100;
    left: 0;
    bottom: 5%;
}

.dialog .audio .main_audio {
    width: 100%;
    height: 100%
}

.dialog .foot {
    position: fixed;
    bottom: 2%;
    left: 0;
    width: 100%;
}

.dialog .foot button {
    background: #f60;
    color: #ffffff;
    font-size: .26rem;
    padding: .16rem .14rem;
    margin-right: .3rem;
    vertical-align: middle;
    border-radius: .06rem;
}
.dialog .foot button.disabled {
    background: #aaa;
}